<template>
    <div class="business">
        <div class="business-container">
            <van-tabs v-model="active" color="#787ac3" :swipe-threshold="6">
                <van-tab :title="item.title" v-for="item,key in businessTabsData" :key="key">
                    <div class="tab-wrapper">
                        <div class="content-block">
                            <img :src="item.imgUrl" class="img_s"  alt="" />
                        </div>
                    </div>
                </van-tab>
            </van-tabs>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Business",
        data(){
            return {
                active:0,
                businessTabsData:[
                    {
                        title:'商业区',
                        imgUrl:'/images/business1.jpg'
                    },
                    {
                        title:'B2',
                        imgUrl:'/images/business2.jpg'
                    },
                    {
                        title:'B3',
                        imgUrl:'/images/business3.jpg'
                    },
                    {
                        title:'1F',
                        imgUrl:'/images/business4.jpg'
                    },
                    {
                        title:'6F',
                        imgUrl:'/images/business5.jpg'
                    },
                ]

            }
        }
    }
</script>

<style lang="less">
    .business{
        width: 100%;
        overflow-x: hidden;
        .business-container{
            .tab-wrapper{
                .content-block{
                    width: 100%;
                    margin: 10px auto;
                    text-align: center;
                    img{
                        width: 94%;
                    }
                }
            }
        }
    }
</style>
